Android app links with assetlinks.json on WIX website - javascript

I am implementing deep linking to my android app and it works only when clicking on a link with the desired url such as https://mydomain.co.il only outside browsers like in whatsapp etc.
I know that for making app links work from browser, the website needs to have assetlinks.json file located at https://mydomain.co.il/.well-known/assetlinks.json in order to verify that I am the owner of both the domain and the app.
So I do have the assetlinks.json file ready but does anyone know how can I put the file in that specific location (https://mydomain.co.il/.well-known/assetlinks.json) on my website when using Wix as the platform ?
Thanks in advance

I struggled to find a straightforward way to host the Android Digital Asset Links file on Wix. Found bits and pieces of help on the net. Tested my code and it seems to work.
Here it goes:
Android needs a Digital Asset Links file hosted on the website of an app to verify ownership. The link required is: https://www.yoursite.com/.well-known/assetlinks.json
Since hosting this file at that location was not a plausible solution on Wix (at least to me at the time of this post), we'll need to add a JS file which can spit out the same JSON data and then redirect the URL Google expects to our new link.
Go to Dev Mode -> Enable Developer Mode and switch on the developer mode
In the new left pane, go to {} (Public & Backend)
Next to Backend, click on +, and create a new Javascript file with the name http-functions.js
Add this code:
// Import the Wix http functions API
import {ok, notFound, serverError} from 'wix-http-functions';
// Set the assetlinks variable (between the single backticks) with the content of your assetlinks.json file
let assetlinks = `[{
"relation": ["delegate_permission/common.handle_all_urls"],
"target" : { "namespace": "android_app", "package_name": "<Your app package>",
"sha256_cert_fingerprints": ["<Your app's SHA256>"] }
}]`
// Define http get function for your trust.txt file
export function get_assetlinks(request) {
let options = {
"headers": {
"Content-Type": "text/plain"
},
"body": assetlinks
};
return ok(options);
}
Publish your site
Test if the JSON is displayed by calling: www.yoursite.com/_functions/assetlinks
Hoping that things are great so far, we'll proceed to the last and final step - URL redirection
Go to site Settings > Marketing & SEO > SEO Tools > URL Redirect Manager
Click on New Redirect and enter for:
Old URL: /.well-known/assetlinks.json
New URL: /_functions/assetlinks
Test out the link www.yoursite.com/.well-known/assetlinks.json
Hope this helps someone! Better late than never.

Related

How to prevent Tauri app from opening remote links

I made a Tauri Hello world app, using react-ts, and that contained logos for Tauri, Vite, and React, that are clickable of course, it uses an a HTML tag like <a href="https://vitejs.dev" target="_blank">, which if I click on it, opens a new tab in my default browser that loads that URL.
So naturally, I wanted to test if Tauri apps would open that link (or any other remote URL actually) inside the app's webview, so I changed that to <a href="https://vitejs.dev"> which did just that.
What I want to know is: how to configure any Tauri app to not open / load any URLs unless I specifically allow it to?
What I tried already:
I tried changing the CSP option in the tauri.conf.json file to none to not allow any remote scripts or ....
"security": {
"csp": {
"default-src": ["'none'"]
}
},
I also tried searching for some kind of allowed-navigation option that someone talked about
I also started looking into a before-navigate hook in the main.rs file but i don't know how to implement it
I would really appreciate it if you explain how to reach my objective, and I would be even more indebted to you if you can give me same better options or the ones more appropriate for a production ready app.
Regards,
zk.

BigCommerce Embedded Checkout NotEmbeddableError: Unable to embed the iframe because the content could not be loaded

I am trying to implement bigcommerce embedded checkout into my rails application.
I followed this url to integrate embedded checkout into my local rails application.
https://developer.bigcommerce.com/api-docs/storefronts/embedded-checkout/embedded-checkout-tutorial
But I have error message of "NotEmbeddableError: Unable to embed the iframe because the content could not be loaded."
These are the steps I did.
I am using rails application locally.
it is running as https://127.0.0.1:3000 (I've tried with localhost, but I can't create site using localhost: it says site name should not contain localhost string)
I created local ssl key and certification and runs the application by
rails s -b 'ssl://127.0.0.1:3000?key=127.0.0.1.key&cert=127.0.0.1.crt'
And I can access the local site by https://127.0.0.1:3000/ although it says 'Not Secure'
I followed the embedded checkout url APIs and able to produce the redirect_urls
for example:
{
"data": {
"cart_url": "https://pbgtest.mybigcommerce.com/cart.php?action=load&id=30df8201-90c9-4950-b784-0d35f16d2b63&token=10b5a5e6853217d23efdaf0b790b707dfd98fabde5495a5f2aaf7238fabbc5a4",
"checkout_url": "https://pbgtest.mybigcommerce.com/cart.php?action=loadInCheckout&id=30df8201-90c9-4950-b784-0d35f16d2b63&token=10b5a5e6853217d23efdaf0b790b707dfd98fabde5495a5f2aaf7238fabbc5a4",
"embedded_checkout_url": "https://pbgtest.mybigcommerce.com/cart.php?embedded=1&action=loadInCheckout&id=30df8201-90c9-4950-b784-0d35f16d2b63&token=10b5a5e6853217d23efdaf0b790b707dfd98fabde5495a5f2aaf7238fabbc5a4"
},
"meta": {}
}
whenever I copy checkout_url or embedded_checkout_url and paste it directly in addressbar it works fine.
I also found that these urls should be at once not twice, so whenever I try a test I regenerate the url
In rails application, I added this code in one of page
<script src="https://checkout-sdk.bigcommerce.com/v1/loader.js"></script>
<script>
$(document).ready(function() {
// const module = await checkoutKitLoader.load('embedded-checkout');
async function show() {
const module = await checkoutKitLoader.load('embedded-checkout');
const service = module.embedCheckout({
url: 'https://pbgtest.mybigcommerce.com/cart.php?embedded=1&action=loadInCheckout&id=30df8201-90c9-4950-b784-0d35f16d2b63&token=10b5a5e6853217d23efdaf0b790b707dfd98fabde5495a5f2aaf7238fabbc5a4',
containerId: 'embedded-checkout-section' #This is div id
});
service
.then(value => {
console.log(value);
})
.catch(err => {
console.log(err);
});
}
show();
}
But I get "NotEmbeddableError: Unable to embed the iframe because the content could not be loaded."
I can't get the proper info like why it failed loading.
I also tested after disable the Anti Virus software but still same error.
Anybody can help?
It is expected behavior that the link is only live for one visit, so you are correct to regenerate these for testing these urls. Is your BigCommerce store published/live? This needs to be true in order for it to be pulled into your embedded checkout experience.
Also, I would recommend using the embedded_checkout url directly.
Got it successful after following steps
Make sure cart channel id matches with one that points to your https localhost
Add route in channel where the embedded checkout needs to be loaded.
In security and privacy settings, check x-frame-options to allow from your https localhost

Open video URL in native player from Google Chrome

I'm trying to open a remote video (let's say it's located at http://www.example.com/video.mp4) with the default Android player launched directly from Google Chrome, making use of the brand new intent://.
This is the URI I called through an href tag:
intent://www.example.com/video.mp4#Intent;scheme=file;action=android.intent.action.VIEW;end;
Of course, this URI doesn't work, and Chrome returns error "Unable to perform navigation". I've also tried the same URI omitting scheme=file.
Here's the documentation I've been following: https://developer.chrome.com/multidevice/android/intents
Thanks in advance!
A quick browse of the Gallery App in AOSP shows that it can be launched from a browser. It has a category of BROWSABLE and DEFAULT. This means given the correct intent URL you should be able to launch it.
Obviously specifying a package should work, but that is not flexible, what if there are two gallery apps.
The following Intent scheme url works:
intent://www.sample-videos.com/video/mp4/720/big_buck_bunny_720p_1mb.mp4#Intent;action=android.intent.action.VIEW;scheme=http;type=video/mp4;end
Note:
scheme = http (it needs to be that or https),
there is a // before the domain, if that is not there the URL is not constructed correctly in the player
action = android.intent.action.VIEW
type = video/mp4 - if this is not in place the video will open in the browser
I have created a demo that works

Django-cms installs, but pull-downs and other JS doesn't work - ideas for fixing?

I've installed Django-CMS onto an existing site and while it isn't throwing errors, it isn't working. In particular, the header on a given page appears when I use "/?edit" but none of the pull down menus work, and very little (possibly none) of the JavaScript works.
Other facets:
I've done this on a local install of Django with largely development components (for example, SQLite, and the server provided via the django tutorial)
I've done this with the same result on an install on WebFactional using MySQL and an apache server
The install is basically the process described here:
http://docs.django-cms.org/en/support-3.0.x/how_to/install.html
The DB install worked w/out errors and the /admin site has a section for CMS
The CMS check showed 1 test skipped, and all other tests passed.
I'm using Django 1.6.5
This isn't the only time I've had trouble getting django to deliver javascript in a way that executes properly on a project - I had problems with fairly simple drop down menus in the past that I never resolved.
Any ideas on what I could be doing wrong? My configuration changes could be seen here:
https://github.com/bethlakshmi/GBE2/compare/GBE-398
The Local Settings (recent edit)
DEBUG = True
TEMPLATE_DEBUG = False
ALLOWED_HOSTS = ['*domain of server*']
LOGIN_REDIRECT_URL = '/'
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'NAME': '*db name*',
'USER': '*username*',
'PASSWORD': '*password*',
'HOST': '',
'PORT': '',
}
}
STATIC_ROOT = '*path to the static host in the file system*'
#STATIC_ROOT = '/'
EMAIL_HOST = '* email settings*'
EMAIL_HOST_USER = '*email settings*'
EMAIL_HOST_PASSWORD = '*email settings*'
DEFAULT_FROM_EMAIL = '*valid email*'
SERVER_EMAIL = '*valid email*'
domain of server - the site is hosted on a subdomain: - prototypecms.gbeadmin.webfactional.com, the Allowed Host is "gbeadmin.webfactional.com"
db name, username, password - the correct settings for the locally hosted database. The website itself works just fine with these database settings. I can log in with the same info using PHP Admin from the console. And when I look in the DB, I see the cms_* tables that came from django-cms during a syncdb.
path to the static host in the file system - its a valid location in the server's file system. The CSS and JS are there and when I download the source page in the browser and look at /static links it references, I get the correct JS or CSS that I would expect from the server. The host recommends a particular separate area for static files and a particular configuration - which I've followed and gotten working successfully in the pre-django-cms application. If it wasn't working, I believe the CSS would not render correctly, and it works fine.
email settings - are the email settings for the server. Right now they are not working and need to be tested and fixed, but I have a large amount of doubt that email settings could be a factor here.
valid email the various email settings used by django in creating a mail. These are valid addresses relevant to the business.
After staring at this for about 1.5 weeks, I think I found the answer.
The eventual process to the solution was to get the tutorial up and running in the same environment and start slavishly comparing settings and templates. With a working tutorial, I could see what was there and slavishly imitate it.
The settings.py and local_settings.py was a rat hole - they worked just fine.
Eventual answer was that the pre-existing site and django-cms were contending over base.html and the block for "content" - there was a mapping for "/" in the base site urls and that meant that it didn't connect to a template, and it didn't have any content blocks. This really seemed to confuse Django-CMS site to the point where it would offer no pulldowns. Once I got base.html (now base.tmpl) to more closely imitate the tutorial, I was able to get the pull downs working.
The commit of the original solution was:
https://github.com/bethlakshmi/GBE2/commit/8286a9afd6e3ba8688dfefc4c9d888f5a2fd320f
And on the branch here:
https://github.com/bethlakshmi/GBE2/tree/GBE-398
There have been many more refinements.
The areas to look at would be gbe/base.tmpl, and also the landing and landing_page areas as the first thing that got executed was predictably the url resolution of "/" - so that was a particular blocker.
This is the leap forward I needed, but still a partial solution as there is a massive amount of integration yet to be done here.

Showing documents from Google Drive on webpage

Is it possible to show the documents from my drive on a webpage? I want the user to be able to click the document and download it, directly from my drive. How would I go about doing this? Thank you for your suggestions.
The fastest and easiest solution is to embed the folder using an iframe (no javascript needed). Obviously this is also the least flexible solution, although you can use CSS to change the layout of the iframe contents (see below).
Google Drive won't allow embedding of the url you would normally use. It has its X-Frame-Options header set to "SAMEORIGIN", preventing use in an iframe. So you have to use the following link, which will allow embedding:https://drive.google.com/embeddedfolderview?id=DOCUMENT_ID#VIEW_TYPE
DOCUMENT_ID is the id that is mentioned in the normal share link (which looks like https://drive.google.com/folderview?id=DOCUMENT_ID), so you can just copy that from there.
VIEW_TYPE should be either 'grid' or 'list', depending on your preference.
And if you need to change the style of the iframe content, take a look at this solution.
For HTML/JavaScript solution, look at the following links:
https://developers.google.com/drive/quickstart-js
https://www.youtube.com/watch?v=09geUJg11iA
https://developers.google.com/drive/web/auth/web-client
Here's the simplest way using JavaScript, most of the complexity is in
your WebApp authorization. The example below reads files IDs, names and description in a folder you specify.
- go to: https://cloud.google.com/console/project
and create a new project "xyz"
- Select "APIs & auth", disable the ones you don't need, enable "Drive API"
- Select "Credentials",
push "CREATE NEW CLIENT ID" button
x Web Application
Authorized Javascript origins: "https://googledrive.com/"
Authorized redirect URI: "https://googledrive.com/oauth2callback"
it will result in:
Client ID: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx.apps.googleusercontent.com
Email address: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx#developer.gserviceaccount.com
Client secret: xxxxxxxxxxxxxxxxxxxx
Redirect URIs: https://googledrive.com/oauth2callback
Javascript Origins: https://googledrive.com/
- in the code below, replace
CLIENT_ID with xxxxxxxxxxxxxxxxxxxxxxxxx.apps.googleusercontent.com
FOLDER_ID with the ID you see in the folder address line,
https://drive.google.com/?tab=mo&authuser=0#folders/xxxxxxxxxxxxxxxxxxx
- run it, authorize
I don't know if you read JS, the code can be followed from bottom up, I made is as simple as possible.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
var FOLDER_ID = '.xxxxxxxxxxxxxxxxxx'; // the folder files reside in
var CLIENT_ID = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxx.apps.googleusercontent.com';
var SCOPE = //'https://www.googleapis.com/auth/drive';
[
'https://www.googleapis.com/auth/drive',
'https://www.googleapis.com/auth/drive.file', // for description,
];
function rsvpCB(resp) {
var picAlbumLst = '<ul>\n';
for (i=0; i<resp.items.length; i++)
picAlbumLst += (
' <li>'+resp.items[i].id+', '+resp.items[i].title+', '+resp.items[i].description+'</li>\n');
picAlbumLst += "</ul>\n";
$('#container').append(picAlbumLst);
}
function rqstCB() { //test # https://developers.google.com/drive/v2/reference/files/list
var rv = gapi.client.drive.files.list({
'q': '"'+FOLDER_ID+'" in parents and trashed = false',
'fields' : 'items(id,title,description)' //'items(id,title,description,indexableText)'
}).execute(rsvpCB);
}
// authorization server reply
function onAuthResult(authResult) {
var authButton = document.getElementById('authorizeButton');
authButton.style.display = 'none';
if (authResult && !authResult.error) { // access token successfully retrieved
gapi.client.load('drive', 'v2', rqstCB);
} else { // no access token retrieved, force the authorization flow.
authButton.style.display = 'block';
authButton.onclick = function() {
checkAuth(false);
}
}
}
// check if the current user has authorized the application.
function checkAuth(bNow) {
gapi.auth.authorize({'client_id':CLIENT_ID, 'scope':SCOPE, 'immediate':bNow}, onAuthResult);
}
// called when the client library is loaded, look below
function onLoadCB() {
checkAuth(true);
}
</script>
<script src="https://apis.google.com/js/client.js?onload=onLoadCB"></script>
<body style="background-color: transparent;">
<input type="button" id="authorizeButton" style="display: none" value="Authorize" />
<div id="container">
</div>
</body>
This should be done with Google API. You can search google drive php api list files on google. And also I found this and this on SO.
Here are some main points:
Do you want anyone with the URL to be able to see your document? You can share a document as public to anyone on the internet. Plus you can set read access to specific folders. Just right click a Google Doc file, and choose 'Share' from the short cut menu.
I'm assuming you want people to download your docs, even when you are not signed in. This is called 'Offline Access', and is one of many terms you'll need to figure out in order to do all of this with a program.
If you only want to give read access to the user, using JavaScript, jQuery, etc on the front end is a viable option. You can also do this in PHP, it's just a matter of personal preference.
To do all of this in code, you need to grant authorization to read your files. The oAuth2 process has multiple steps, and it's good to understand the basic flow. Setting up the code and the webpages to initially grant authorization, then retrieve and store the tokens can get confusing.
Your Google Project has a setting for where the origin of the authorization request is coming from. That is your website. But if you want to develop and test locally, you can set the Javascript Origins to http://localhost
How much time do you have, and how much programming experience? Would it be easier to give the user a few lines of instruction to "Manually" download your file, rather than program the authorization check?
Putting the document into your webpage is the easy part.
In order to embed a Google doc in your website, go to your Google Drive, open a document and choose File then Publish to Web, and you will be given an HTML iFrame Tag that can be embedded into you web page. You can change the height and width of the iFrame to match the document size. iFrame Instructions W3Schools
Downloading your document can be done very easily from the online version of a shared document just by choosing FILE and then DOWNLOAD AS from the menu.
To get up and running fast, just give the user a couple lines of instructions on how to download "Manually", then see if you can program the code.
Provide a link to your shared document instead of programming the button, and then work on the code.
Search Git Hub for Google Drive, you might find something there.
Some of the official Google code examples are way more complicated than you need, and will take a long time to figure out. The code examples in the documentation pages are simpler, but are almost never complete functioning code examples. You'll need to put lots of pieces of the puzzle together to make it work.

Categories

Resources