not able to download vcard on iphone Chrome - javascript

I am having some trouble downloading vcard on iphone chrome.
I making an API call from the href which returns a .vcf file to download the vcard, it is working fine on desktop (IE/Chorme/Firefox..) and working fine on iphone safari and samsung chrome,
but when i tried to download on a chrom iphone it is throwing an exception as shown in the image
Using
API bound to href is something like GET: http://.../rest/v1/profiles/00d5a2fb-ab56-a555-a5d5-0050569257ef/vcard
code to return the vcards .vcf file is something like
var vCard = BuildVCard(profile, profileUrl);
vCard returns a Vcard
return new FileActionResult(
new StringContent(vCard.ToString()),
"text/vcard",
CreateVCardFileName(profile));
and CreateVCardFileName returns a string.Format("{0}.vcf", fileName);
the entities on fiddler headers shows something like
Content-Disposition: attachment; filename=Uma.vcf
Content-Type: text/vcard
Is this something related to IOS- Chrome thing, do I need to add anything to download the vcard like any specific mime-types.
Appreciate your help and time.

I tried using this on a site. Routing to a "Please open in safari" page did work. Getting the .vcf file to download on chrome mobile by linking to the .vcf file like in the demo did not, it only brought me to a blank external page or gave me a fail like yours above.
When I put the exact live demo on my server the download to ANY phone button still did not work as the original live demo. It is my opinion that the different PHP versions the sites a running on are causing this but I could be very wrong.
How to add a contact to the iPhone's Address Book from a Web Page?

Related

Eel application: download files in Browser

i´m currently using JavaScript and HTML with eel and Python. But unfortunately when I am trying to create a file in the Chrome-Browser window (as an download) over JS i can only download it once.
The second "download" is not working.
-> Chrome just shows this (as it does when it downloads something) but then nothing happens:
When I am using Edge browser or only JS without eel it works perfectly fine!
My JS function that creates the download: (string is a json string that is generated earlier).
var jsonLink = document.getElementById("jsonLink");
jsonLink.download = "exportedToJson.json";
jsonLink.href = "data:application/json;charset=utf-8," + encodeURIComponent(string);
Ok I found a solution:
My chrome browser was blocking more than one download from "localhost:8000". So I had to go to settings and allow more than one download.
Maybe this helps someone :)
Why did I not find this earlier:
When I started my Python script, it calls:
eel.start('index.html', mode='chrome', port=8000) #starting chrome
Which does open a new Chrome Tab without the Tabbar (so i did neither see the tabs nor my favorite sites). Therefore I did not get a notification when chrome stated that download is blocked.
But after starting the eel-local webserver and open localhost:8000 in my normal chrome window, I did get a notification and I was able to allow the downloads.
-> afterwards it also worked in this eel-chrome window.

Open PDF from server in a browser

Hi I've got follow json:
let help = {
url: 'file://myServer/folder1/myFile.pdf'
};
With this function I try to open the file in a browser:
openPdf() {
window.open(help.url);
}
This is my html:
<button ng-click="ctrl.openPdf()">Open PDF</button>
Now, when I click on the button, a new tab opens in the browser without the pdf file. There isn't also my url from the json. It opens a empty page - about:blank. But when I copy the url from the json and paste it again in the browser, it opens the file correctly. But this also works only, when I put file:// before the url (without this, or with http:// etc. it also doesn't work) - Browser = Google Chrome. The confusing thing is: It works on Internet Explorer! When I open the url (with file://), than it shows me the pdf in a new browser tab. Is there perhaps a pdf plugin for browser, that isn't installed on chrome? Any ideas what could be wrong here? Thanks

View JSON file in Browser

It is not a programming question, but need your views in few words.
When we hit the JSON url in Broswer, it asks us to save the file.
Why this happens ?
Is there any way to view it on the page itself ?
Is there any addon available to view JSON file in browser?
In Chrome use JSONView
or Firefox use JSONView
If you don't want to install extensions, you can simply prepend the URL with view-source:, e.g. view-source:http://content.dimestore.com/prod/survey_data/4535/4535.json. This usually works in Firefox and Chrome (will still offer to download the file however if Content-Disposition: attachment header is present).
In Chrome, use JSONView to view formatted JSON.
To view "local" *.json files:
- after install You must open the Extensions option from Window menu.
- Check box next to "Allow Access to File URLs"
- note that save is automatic (i.e. no explicit save necessary)
Re-open the *.json file and it should be formatted.
Firefox 44 includes a built-in JSON viewer (no add-ons required). The feature is turned off by default, so turn on devtools.jsonview.enabled:
How can you disable the new JSON Viewer/Reader in Firefox Developer Edition?
json-ie.reg. for IE
try this url
http://www.jsonviewer.com/
Well I was searching view json file in WebBrowser in my Desktop app, when I try in IE still same problem IE was also prompt to download the file.
Luckily after too much search I find the solution for it.
You need to :
Open Notepad and paste the following:
[HKEY_CLASSES_ROOT\MIME\Database\Content Type\application/json]
"CLSID"="{25336920-03F9-11cf-8FD0-00AA00686F13}"
"Encoding"=hex:08,00,00,00
Save document as Json.reg and then right click on file and run as administrator.
After this You can view json file in IE and you Desktop WebBrowser enjoy :)
For Firefox's Bookmarks JSON files, use this excellent Bookmarklet:
javascript:(function(){var E=document.getElementsByTagName('PRE')[0],T=E.innerHTML,i=0,r1,r2;t=new Array();while(/("uri":"([^"]*)")/g.exec(T)){r1=RegExp.$1;r2=RegExp.$2;if(/^https?:/.exec(r2)){t[i++]='['+(i)+']:<a href='+r2+'>'+r2+'<\/a>';}}with(window.open().document){for(i=0;t[i];i++)write(t[i]+'<br>');close();}})();
Source: "alterna" from forums.Mozillazine.org:
http://forums.mozillazine.org/viewtopic.php?p=5551705#p5551705
I have the Content-Type of my JSON-printing CGIs set to text/javascript.
Works fine for both displaying in browser (e.g. Firefox) and processing in script.
Of course there's no syntax-highlighting in this case.
If there is a Content-Disposition: attachment reponse header, Firefox will ask you to save the file, even if you have JSONView installed to format JSON.
To bypass this problem, I removed the header ("Content-Disposition" : null) with moz-rewrite Firefox addon that allows you to modify request and response headers https://addons.mozilla.org/en-US/firefox/addon/moz-rewrite-js/
An example of JSON file served with this header is the Twitter API (it looks like they added it recently). If you want to try this JSON file, I have a script to access Twitter API in browser: https://gist.github.com/baptx/ffb268758cd4731784e3
I would also recommend to use Notepad++ with json-view extension. You get the extension here: https://sourceforge.net/projects/nppjsonviewer/
Install and restart Notepad++.
Then open json-file in Notepad and go to "extensions -> Json-Viewer - > Format JSON. Then you habe the hierarchical view of json.
You can also use one of the online-viewers (http://jsonviewer.stack.hu/ , https://jsoneditoronline.org/) which look nice, but I wouldn't recommend this if your data are sensitive in terms of privacy.
For Safari 12 and later, you can try the JSONBeautifier bookmarklet. Also works with other browsers.
I created this because JSON Formatter for Safari stopped working in Safari 12. There are a few new options for Safari 12, but I didn't find an open source one in the App Store, and I do not trust closed source browser extensions.
This can be used as a bookmarklet or the source, json-beautifier.js, can be copied and pasted into the browser console. The code is freely available for review and is less than 100 lines of code including comments. Runs entirely on your device and never sends your data over a network.
Works with local files too. 🤓
Try this one Chrome extension https://chrome.google.com/webstore/detail/json-%3E-table/pjdecdkdljmchigbkalnblidepkeojda
Just install and open URL in browser
Microsoft Edge Browser
Json format easily view this but you have some changes in browser.
Browser setting
Go to browser edge://flags/
Search Json viewer
Change "Default to Enabled"
Restart Browser
[Done changes]
Chrome Browser
Install Extension Json viewer
Then view this pure json and change setting also
Right click on JSON file, select open, navigate to program you want open with(notepad). Consecutive opens automatically use notepad.

PDF files do not open in Internet Explorer with Adobe Reader 10.0 - users get an empty gray screen. How can I fix this for my users?

There is a known issue with opening a PDF in Internet Explorer (v 6, 7, 8, 9) with Adobe Reader X (version 10.0.*). The browser window loads with an empty gray screen (and doesn't even have a Reader toolbar). It works perfectly fine with Firefox, Chrome, or with Adobe Reader 10.1.*.
I have discovered several workarounds. For example, hitting "Refresh" will load the document properly. Upgrading to Adobe Reader 10.1.*, or downgrading to 9.*, fixes the issue too.
However, all of these solutions require the user to figure it out. Most of my users get very confused at seeing this gray screen, and end up blaming the PDF file and blaming the website for being broken. Honestly, until I researched the issue, I blamed the PDF too!
So, I am trying to figure out a way to fix this issue for my users.
I've considered providing a "Download PDF" link (that sets the Content-Disposition header to attachment instead of inline), but my company does not like that solution at all, because we really want these PDF files to display in the browser.
Has anyone else experienced this issue?
What are some possible solutions or workarounds?
I'm really hoping for a solution that is seamless to the end-user, because I can't rely on them to know how to change their Adobe Reader settings, or to automatically install updates.
Here's the dreaded Gray Screen:
Edit: screenshot was deleted from file server! Sorry!
The image was a browser window, with the regular toolbar, but a solid gray background, no UI whatsoever.
Background info:
Although I don't think the following information is related to my issue, I'll include it for reference:
This is an ASP.NET MVC application, and has jQuery available.
The link to the PDF file has target=_blank so that it opens in a new window.
The PDF file is being generated on-the-fly, and all the content headers are being set appropriately.
The URL does NOT include the .pdf extension, but we do set the content-disposition header with a valid .pdf filename and the inline setting.
Edit: Here is the source code that I'm using to serve up the PDF files.
First, the Controller Action:
public ActionResult ComplianceCertificate(int id){
byte[] pdfBytes = ComplianceBusiness.GetCertificate(id);
return new PdfResult(pdfBytes, false, "Compliance Certificate {0}.pdf", id);
}
And here is the ActionResult (PdfResult, inherits System.Web.Mvc.FileContentResult):
using System.Net.Mime;
using System.Web.Mvc;
/// <summary>
/// Returns the proper Response Headers and "Content-Disposition" for a PDF file,
/// and allows you to specify the filename and whether it will be downloaded by the browser.
/// </summary>
public class PdfResult : FileContentResult
{
public ContentDisposition ContentDisposition { get; private set; }
/// <summary>
/// Returns a PDF FileResult.
/// </summary>
/// <param name="pdfFileContents">The data for the PDF file</param>
/// <param name="download">Determines if the file should be shown in the browser or downloaded as a file</param>
/// <param name="filename">The filename that will be shown if the file is downloaded or saved.</param>
/// <param name="filenameArgs">A list of arguments to be formatted into the filename.</param>
/// <returns></returns>
[JetBrains.Annotations.StringFormatMethod("filename")]
public PdfResult(byte[] pdfFileContents, bool download, string filename, params object[] filenameArgs)
: base(pdfFileContents, "application/pdf")
{
// Format the filename:
if (filenameArgs != null && filenameArgs.Length > 0)
{
filename = string.Format(filename, filenameArgs);
}
// Add the filename to the Content-Disposition
ContentDisposition = new ContentDisposition
{
Inline = !download,
FileName = filename,
Size = pdfFileContents.Length,
};
}
protected override void WriteFile(System.Web.HttpResponseBase response)
{
// Add the filename to the Content-Disposition
response.AddHeader("Content-Disposition", ContentDisposition.ToString());
base.WriteFile(response);
}
}
It's been 4 months since asking this question, and I still haven't found a good solution.
However, I did find a decent workaround, which I will share in case others have the same issue.
I will try to update this answer, too, if I make further progress.
First of all, my research has shown that there are several possible combinations of user-settings and site settings that cause a variety of PDF display issues. These include:
Broken version of Adobe Reader (10.0.*)
HTTPS site with Internet Explorer and the default setting "Don't save encrypted files to disk"
Adobe Reader setting - disable "Display PDF files in my browser"
Slow hardware (thanks #ahochhaus)
I spent some time researching PDF display options at pdfobject.com, which is an EXCELLENT resource and I learned a lot.
The workaround I came up with is to embed the PDF file inside an empty HTML page. It is very simple: See some similar examples at pdfobject.com.
<html>
<head>...</head>
<body>
<object data="/pdf/sample.pdf" type="application/pdf" height="100%" width="100%"></object>
</body>
</html>
However, here's a list of caveats:
This ignores all user-preferences for PDFs - for example, I personally like PDFs to open in a stand-alone Adobe Reader, but that is ignored
This doesn't work if you don't have the Adobe Reader plugin installed/enabled, so I added a "Get Adobe Reader" section to the html, and a link to download the file, which usually gets completely hidden by the <object /> tag, ... but ...
In Internet Explorer, if the plugin fails to load, the empty object will still hide the "Get Adobe Reader" section, so I had to set the z-index to show it ... but ...
Google Chrome's built-in PDF viewer also displays the "Get Adobe Reader" section on top of the PDF, so I had to do browser detection to determine whether to show the "Get Reader".
This is a huge list of caveats. I believe it covers all the bases, but I am definitely not comfortable applying this to EVERY user (most of whom do not have an issue).
Therefore, we decided to ONLY do this embedded option if the user opts-in for it. On our PDF page, we have a section that says "Having trouble viewing PDFs?", which lets you change your setting to "embedded", and we store that setting in a cookie.
In our GetPDF Action, we look for the embed=true cookie. This determines whether we return the PDF file, or if we return a View of HTML with the embedded PDF.
Ugh. This was even less fun than writing IE6-compatible JavaScript.
I hope that others with the same problem can find comfort knowing that they're not alone!
I don't have an exact solution, but I'll post my experiences with this in case they help anyone else.
From my testing, the gray screen is only triggered on slower machines [1]. To date, I have not been able to recreate it on newer hardware [2]. All of my tests have been in IE8 with Adobe Reader 10.1.2. For my tests I turned off SSL and removed all headers that could have disabled caching.
To recreate the gray screen, I followed the following steps:
1) Navigate to a page that links to a PDF
2) Open the PDF in a new window or tab (either via the context menu or target="_blank")
3) In my tests, this PDF will open without error (however I have received user reports indicating failure on the first PDF load)
4) Close the newly opened window or tab
5) Open the PDF (again) in a new window or tab
6) This PDF will not open, but instead only show the "gray screen" mentioned by the first user (all subsequent PDFs that are loaded will also not display -- until all browser windows are closed)
I performed the above test with several different PDF files (both static and dynamic) generated from different sources and the gray screen issue always occurs when following the above steps (on the "slow" computer).
To mitigate the problem in my application, I "tore down" the page that links to the PDF (removed parts piece by piece until the gray screen no longer occurred). In my particular application (built on closure-library) removing all references to goog.userAgent.adobeReader [3] appears to have fixed the issue. This exact solution won't work with jquery or .net MVC but maybe the process can help you isolate the source of the issue. I have not yet taken the time to isolate which particular portion of goog.userAgent.adobeReader triggers the bug in Adobe Reader, but it is likely that jquery might have similar plugin detection code to that used in closure-library.
[1] Machine experiencing gray screen:
Win Server '03 SP3
AMD Sempron 2400+ at 1.6GHz
256MB memory
[2] Machine not experiencing gray screen:
Win XP x64 SP2
AMD Athlon II X4 620 at 2.6 GHz
4GB memory
[3] http://closure-library.googlecode.com/svn/docs/closure_goog_useragent_adobereader.js.source.html
I ran into this issue around the time MVC1 was first released. See Generating PDF, error with IE and HTTPS regarding the Cache-Control header.
For Win7 Acrobat Pro X
Since I did all these without rechecking to see if the problem still existed afterwards, I am not sure which on of these actually fixed the problem, but one of them did. In fact, after doing the #3 and rebooting, it worked perfectly.
FYI: Below is the order in which I stepped through the repair.
Go to Control Panel > folders options under each of the General, View and Search Tabs
click the Restore Defaults button and the Reset Folders button
Go to Internet Explorer, Tools > Options > Advanced > Reset ( I did not need to delete personal settings)
Open Acrobat Pro X, under Edit > Preferences > General.
At the bottom of page select Default PDF Handler. I chose Adobe Pro X, and click Apply.
You may be asked to reboot (I did).
Best Wishes
In my case the solution was quite simple.
I added this header and the browsers opened the file in every test.
header('Content-Disposition: attachment; filename="filename.pdf"');
I had this problem. Reinstalling the latest version of Adobe Reader did nothing. Adobe Reader worked in Chrome but not in IE. This worked for me ...
1) Go to IE's Tools-->Compatibility View menu.
2) Enter a website that has the PDF you wish to see. Click OK.
3) Restart IE
4) Go to the website you entered and select the PDF. It should come up.
5) Go back to Compatibility View and delete the entry you made.
6) Adobe Reader works OK now in IE on all websites.
It's a strange fix, but it worked for me. I needed to go through an Adobe acceptance screen after reinstall that only appeared after I did the Compatibility View trick. Once accepted, it seemed to work everywhere. Pretty flaky stuff. Hope this helps someone.
Hm, would it be possible to simply do this:
The first time your user opens a pdf, using Javascript you make a popout that basically says "If you cannot see your document, please click HERE". Make "HERE" a big button where it will explain to your user what's the problem. Also make another button "everything's fine". If the user clicks on this one, you remember it, so it isn't displayed in the future.
I'm trying to be practical. Going to great lengths trying to solve this kind of problem "properly" for a small subset of Adobe Reader versions doesn't sound very productive to me.
Experimenting more, the underlying cause in my app (calling goog.userAgent.adobeReader) was accessing Adobe Reader via an ActiveXObject on the page with the link to the PDF. This minimal test case causes the gray screen for me (however removing the ActiveXObject causes no gray screen).
<!DOCTYPE html>
<html lang="en">
<head>
<title>hi</title>
<meta charset="utf-8">
</head>
<body>
<script>
new ActiveXObject('AcroPDF.PDF.1');
</script>
<a target="_blank" href="http://partners.adobe.com/public/developer/en/xml/AdobeXMLFormsSamples.pdf">link</a>
</body>
</html>
I'm very interested if others are able to reproduce the problem with this test case and following the steps from my other post ("I don't have an exact solution...") on a "slow" computer.
Sorry for posting a new answer, but I couldn't figure out how to add a code block in a comment on my previous post.
For a video example of this minimal test case, see: http://youtu.be/IgEcxzM6Kck
I realize this is a rather late post but still a possible solution for the OP. I use IE9 on Win 7 and have been having Adobe Reader's grey screen issues for several months when trying to open pdf bank and credit card statements online. I could open everything in Firefox or Opera but not IE. I finally tried PDF-Viewer, set it as the default pdf viewer in its preferences and no more problems. I'm sure there are other free viewers out there, like Foxit, PDF-Xchange, etc., that will give better results than Reader with less headaches. Adobe is like some of the other big companies that develop software on a take it or leave it basis ... so I left it.
We were getting this issue even after updating to the latest Adobe Reader version.
Two different methods solved this issue for us:
Using the free version of Foxit Reader application in place of Adobe Reader
But, since most of our clients use Adobe Reader, so instead of requiring users to use Foxit Reader, we started using window.open(url) to open the pdf instead of window.location.href = url. Adobe was losing the file handle on for some reason in different iframes when the pdf was opened using the window.location.href method.

jQuery $.get from local directory producing different behaviour in IE vs FF, Chrome

I have the following simple jQuery:
$.get('Data.csv', function(data) {
alert(data);
});
Data.csv is stored in the same folder as the html file which accesses it.
If I run this in all browsers when the url is a domain (i.e. www.mysite.com/path/to/file), then the alert will display a string value of the contents of Data.csv.
If I create a hosts file link to the local folder (i.e. host.mysite.com/path/to/file) then alert will display a string value of the contents of Data.csv in all browsers.
If I run this in IE 9 when the url opens the file locally (i.e c:\path\to\file) then the alert will display a string value of the contents of Data.csv.
However, if I run this in FF or Chrome when the url opens the file locally (i.e file:///c:/path/to/file) then the alert will display [object XMLDocument].
Does anyone know why this is and how to open the local file as a string in FF and Chrome?
n.b. - I have tested this in order to rule out cross-platform-security issues. I don't think that that is the cause because otherwise it would not assign the content of the csv file at all.
Thanks in advance.
You're running into issues with the Same Origin Policy. If you look into your browser's console, you'll see something along the lines of Origin null is not allowed by Access-Control-Allow-Origin.
There's two possible fixes:
Run your stuff on a local web server like XAMPP, MAMP or the like.
Disable all web security on Chrome Startup, which you obviously don't want to do in real life. Wouldn't work in FF, either. So, stick with 1. ;)

Categories