Using the docs from here: https://developer.vimeo.com/api/upload/videos
This is my request body, POSTed to api.vimeo.com/me/videos:
upload: { approach: "post", redirect_url: "https://www.example.com/app/video", size: 5253880 }
I am getting back a valid upload response, and able to submit the upload.form just fine to upload my video, however am redirected to the default Vimeo success screen instead of my own /app/video screen as desired. There's a redirect_uri property on the response which is null, so for some reason they seem to be ignoring my redirect_url. What am I missing here?
Here is the complete code being used to create the request:
const size = e.target.files[0].size;
const XHR = new XMLHttpRequest();
const uploadParams = {
upload: {
approach: 'post',
redirect_url: 'https://www.example.com/app/video',
size,
},
};
XHR.addEventListener('load', $scope.upload, false);
XHR.addEventListener('error', $scope.uploadError, false);
XHR.open('POST', 'https://api.vimeo.com/me/videos');
XHR.setRequestHeader('Authorization', `Bearer ${vimeoToken}`);
XHR.send(JSON.stringify(uploadParams));
Just figured it out, leaving this up for anyone else who misses this part of the docs: you need to set the Accept header to "application/vnd.vimeo.*+json;version=3.4" which I wasn't doing, and it was still letting me upload, but just not processing my request params.
Related
Could anybody please help me with this as i have tried several different methods all to no avail.
im trying to send the old image src name along with the new image data via ajax, but i can only manage to send 1 or the other and not both..
file = input.files[0];
newimagesrc=input.files[0].name;
oldimagesrc=oldsrc;
formData= new FormData();
formData.append("image", file , newimagesrc);
recent attempt failed formData2= new FormData();
recent attempt failed formdata2.append('oldimage', oldimagesrc);
$.ajax({
url: "UploadProfileImage.php",
type: "POST",
data: formData,
processData: false,
contentType: false,
success: function(messagereturn1){
alert(messagereturn1);
}
});
No buttons or forms im afraid, strictly passing variable's onchange / onclick.
Not sure how to send the old image src through ajax as well as the new image data , i would like to send more variables if possible that have been passed into JS function..
var form_data = new FormData(); // Creating object of FormData class
form_data.append("image", file , newimagesrc) // Appending image parameter
form_data.append("oldimagesrc", oldimagesrc) //added a second variable then received in PHP as a $_POST['oldimagesrc']
PHP
if (isset($_POST['oldimagesrc'])){ $oldimagesrc=$_POST['oldimagesrc']; }
I'm developing a website that supports desktop notifications. I'm utilizing GCM and Azure Notification Hub to send push messages to end users. I followed this codelab tutorial. When testing I have found that the push notifications do get displayed on the screen, but the message that I have written in the payload is not shown in the notification. So I again went through the codelab, and they have mentioned a body key in the showNotification method.
Code
self.addEventListener('push', function(event) {
console.log('Push message', event);
var title = 'Push message';
event.waitUntil(
self.registration.showNotification(title, {
body: 'The Message',
icon: 'images/icon.png',
tag: 'my-tag'
}));
});
They have hardcoded "The Message" in the showNotification function. I don't want to hardcode my message in the function since my message won't be the same always and will vary time to time. I want to know how to make the function take the message in payload and display it. Thanks in advance!
Chrome doesn't support push payloads yet, for now you could use them only in Firefox.
The solution is to request the payload from the server (using fetch) once you get a notification.
Something like this:
self.addEventListener('push', function(event) {
event.waitUntil(
fetch('./getPayload?someUniqueID=' + someUniqueID)
.then(function(response) {
return response.text();
})
.then(function(payload) {
self.registration.showNotification('Title', {
body: payload,
});
})
);
});
Obviously, the response can also be in JSON, so that you can specify everything (title, body, icon, etc.).
You can see an example here: https://serviceworke.rs/push-get-payload.html.
Another possible solution is to use the payload when it's available and use fetch otherwise. This way you can take advantage of the feature in Firefox (and in Chrome once available), and have a fallback for browsers that don't support payloads yet.
There's an example in Mercurius.
I'm trying to create an extension that adds 2 fields to the admin product page of shopify in order to add a metafield.
I know there are some extensions out there, like ShopifyFD and CustomFields, but mine is really, really simple, i'm by no means trying to copied it, this is very custom for my shopify store.
All I want, is to add 2 specific metafields to the page, and save it when i click the button Save.
That said, Everything is already working, but i'm having a problem during POST/PUT. It keeps returning status '303 See Other' and redirecting me to login, behavior that I do not encounter on neither of the 2 extensions i cited in the beginning. I wonder if the approach i'm using is the problem or what else could it be, so i'm resourcing to your help.
here how the header look like:
Request URL:https://mywebsite.myshopify.com/admin/products/461395295/metafields/9911129091.json
Request Method:PUT
Status Code:303 See Other
Remote Address:23.227.38.70:443
Like I mentioned I used a different approach as ShopifyFD or CustomFields, instead of loading a script, i'm using the content script.
here how my manifest look like:
"content_scripts": [
{
"all_frames": true,
"matches": [
"https://*.myshopify.com/admin/products/*"
],
"run_at": "document_end",
"js": [
"scripts/vendors/jquery.js",
"scripts/vendors/handlebars-v3.0.0.js",
"scripts/vendors/handlebars-helpers.js",
"scripts/utils.js",
"scripts/shopify-product-addon.js"
]
}
]
1 - I replace the current Save button with a new one so i can save the metafields before submitting the native form
2 - I append the POST/PUT method to the new Save button i have replaced
here how my post/put looks like:
Note: record is the values i'm saving.
var metaJSON;
if (record.update) {
metaJSON = {
'metafield': {
'id': record.metafield_id,
'value': record.value,
'value_type': record.value_type
}
}
method = 'PUT';
url = '/admin/' + route_url + '/metafields/' + record.metafield_id + '.json';
} else {
metaJSON = {
'metafield': {
'namespace': record.namespace,
'key': record.key,
'value': record.value,
'value_type': record.value_type
}
};
url = '/admin/' + route_url + '/metafields.json';
method = 'POST';
}
$.ajax({
type: method,
url: url,
data: metaJSON,
dataType: 'json',
success: function(d) {
console.log('SUCCESS');
},
error: function(d) {
console.log('ERROR');
}
});
The problem is that It fails everytime. I wonder what's wrong. Is the method i'm using?
I'm doing pretty much as the ShopifyFD is when posting/putting to the ajax api, just not sure what's missing. the only difference i've found was that on the ShopifyFD, there is a cookie set to request_method=PUT or request_method=POST. I don't know how this cookie is set, because it's not on the script. I even tried to set it manually, but it doesn't work.
As you can see, i have tried pretty much everything.
Does anyone else has any other suggestion?! :P
Thanks
I didn't figure it out why ShopifyFD works, i would really like to understand thou, but i found another way to make it work.
You need to set the CSRF token before you request the header.
Works like a charm!
$.ajax({
type: method,
url: url,
data: metaJSON,
beforeSend: function (request) {
var token = $("meta[name=csrf-token]").attr('content');
request.setRequestHeader("X-CSRF-Token", token);
},
.
.
.
I tested this on firefox and ie and worked. But when testing on chrome, I see in the firebug console that the request never loads.
This is the test page: http://gotune.to/index2.php
And here is the function + $.ajax() request.
function getProgress(id) {
$.ajax({
type: 'POST',
cache: false,
url: "getprogress.php",
//Pass our upload identifier as a parameter.
data: {uid: id},
success: function (d) {
//Get the output as an integer.
var progress = parseInt(d, 10);
//If upload progress is not 100, change bar percentage and update again.
if (progress != '100') {
$('#ProgressBar').css('width', progress + '%');
//We aren't done, update again.
getProgress(id);
}
}
});
}
UPDATE
Tried with
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(textStatus+" - "+errorThrown);
}
But still not working.
After a web research for this issue if found this:
Turns out it's a bug, in any webkit
based browser all ajax is essentially
blocked until the file upload is
complete. to bypass this you have to
dynamically create an iframe and run
the ajax requests from within it.
So is a problem of the webkit browsers, thanks #ifaour for your time.
THE BUG REPORT CAN BE FOUND HERE: https://bugs.webkit.org/show_bug.cgi?id=23933
I need to do a cross-domain request in a chrome extension. I know I can it via message passing but I'd rather stick to just jQuery idioms (so my javascript can also work as a <script src="">).
I do the normal:
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?", function(data) {
console.log(data);
});
but in the error console I see:
Uncaught ReferenceError: jsonp1271044791817 is not defined
Is jQuery not inserting the callback function correctly into the document? What can I do to make this work?
(If I paste the code into a chrome console, it works fine, but if I put it as the page.js in an extension is when the problem appears.)
Alas, none of these worked, so I ended up doing the communication via the background.html.
background.html
<script src="http://code.jquery.com/jquery-1.4.2.js"></script>
<script>
function onRequest(request, sender, callback) {
if (request.action == 'getJSON') {
$.getJSON(request.url, callback);
}
}
chrome.extension.onRequest.addListener(onRequest);
</script>
javascripts/page.js
chrome_getJSON = function(url, callback) {
console.log("sending RPC");
chrome.extension.sendRequest({action:'getJSON',url:url}, callback);
}
$(function(){
// use chrome_getJSON instead of $.getJSON
});
If you specify "api.flickr.com" in your manifest.json file you will not need to use the JSONP callback, script injection style of cross domain request.
For example:
"permissions": ["http://api.flickr.com"],
This should work beautifully in you code. I would remove the querystring parameter "&jsoncallback" as there is no JSONP work needed.
The reason why your current code is not working is your code is injecting into pages DOM, content scripts have access to the DOM but no access to javascript context, so there is no method to call on callback.
My impressions it that this fails because the jQuery callback function is being created within the 'isolated world' of the Chrome extension and is inaccessible when the response comes back:
http://code.google.com/chrome/extensions/content_scripts.html#execution-environment
I'm using Prototype and jQuery for various reasons, but my quick fix should be easy to parse:
// Add the callback function to the page
s = new Element('script').update("function boom(e){console.log(e);}");
$$('body')[0].insert(s);
// Tell jQuery which method to call in the response
function shrink_link(oldLink, callback){
jQuery.ajax({
type: "POST",
url: "http://api.awe.sm/url.json",
data: {
v: 3,
url: oldLink,
key: "5c8b1a212434c2153c2f2c2f2c765a36140add243bf6eae876345f8fd11045d9",
tool: "mKU7uN",
channel: "twitter"
},
dataType: "jsonp",
jsonpCallback: callback
});
}
// And make it so.
shrink_link('http://www.google.com', "boom");
Alternatively you can try using the extension XHR capability:
http://code.google.com/chrome/extensions/xhr.html
var xhr = new XMLHttpRequest();
xhr.open("GET", "http://api.example.com/data.json", true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
// JSON.parse does not evaluate the attacker's scripts.
var resp = JSON.parse(xhr.responseText);
}
}
xhr.send();
The syntax is a little off. There's no need for the callback( bit. This works flawlessly. Tested in the javascript console of Chrome on this StackOverflow page (which includes jQuery):
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?", function(data) {
console.log(data);
});
As many of you will know, Google Chrome doesn't support any of the handy GM_ functions at the moment.
As such, it is impossible to do cross site AJAX requests due to various sandbox restrictions (even using great tools like James Padolsey's Cross Domain Request Script)
I needed a way for users to know when my Greasemonkey script had been updated in Chrome (since Chrome doesn't do that either...). I came up with a solution which is documented here (and in use in my Lighthouse++ script) and worth a read for those of you wanting to version check your scripts:
http://blog.bandit.co.nz/post/1048347342/version-check-chrome-greasemonkey-script