Phantom.js .NET authentication failure - phantomjs

Once I submit the form (either by form.submit() or element.click()), the page reloads but, is not redirected to the authenticated side of the site. It's simply the same page as the authentication failed page. The difference though is that, the new rendered page has the password removed from the password field.
var page = require('webpage').create();
page.onUrlChanged = function(url) {
console.log('Change to: ' + url);
};
page.onResourceError = function(resourceError) {
page.reason = resourceError.errorString;
page.reason_url = resourceError.url;
};
page.settings.userAgent = 'Mozilla/46.0.1 (X11; Linux x86_64)AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.71 Safari/537.36'
page.viewportSize = { width: 1280, height: 1024 };
page.onConsoleMessage = function(msg) {
console.log(msg);
};
page.open('https://www.some site/default.asp',function(status) {
console.log("Status: " + status);
if(status === "success") {
page.evaluate(function() {
console.log("set values in a aform");
var x=document.getElementsByTagName("input");
x[8].value="blaa";
x[9].value="blaa";
x[10].value="blaa";
x[11].click();
});
window.setTimeout(function () {
phantom.exit();
}, 9000);
page.render('bsplogin1.png');
}
else{
console.log( "page not open!" );
phantom.exit( 0 );
}});

Related

Expo React-Native Youtube video upload using Fetch()

I am trying to upload a video on youtube using the V3 Youtube.video.insert API method. When I call the method I get the following error message: Bad request: Request contains an invalid argument.. Despite the error message my upload still appears in my personal YouTube account under My Videos. I am new to React Native and I'm struggling to understand the Youtube API docs, could someone please explain to me what I'm doing wrong or how could I fix it?
This is my current request:
let response = await fetch(
'https://youtube.googleapis.com/youtube/v3/videos?key=' + API_KEY,
{
method: 'POST',
headers: {
'Authorization': 'Bearer ' + accessToken,
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify({
part: 'id,snippet,status',
notifySubscribers: false,
requestBody: {
snippet: {
title: 'YouTube Upload Test',
description: 'Testing YouTube upload',
},
status: {
privacyStatus: 'private',
},
},
media: {
body: 'file:///data/user/0/host.exp.exponent/cache/ExperienceData/Camera/video.mp4',
}
})
}
);
I tried taking everything out from body: but I got the same response.
Here are the links that I am using trying to understand:
https://developers.google.com/youtube/v3/docs/videos/insert
https://github.com/googleapis/google-api-nodejs-client/blob/master/samples/youtube/upload.js
UPDATE:
Ok, I think I figured out but I still don't know how can I attach the video file... this is my code now:
let response = await fetch(
'https://youtube.googleapis.com/youtube/v3/videos?part=snippet&part=status&key=' + API_KEY,
{
method: 'POST',
headers: {
'Authorization': 'Bearer ' + accessToken,
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify({
snippet: {
title: "This is the title",
description: "This is the description.",
},
status: {
privacyStatus: 'private',
}
}),
}
);
I solved it! I took corse_upload.js from YouTube API Samples and implemented it in React Native / Expo.
Here is the API.js in React Native that I am using:
import React, { Component } from 'react';
export default class API extends Component {
constructor(props) {
super(props);
const obj = this;
const DRIVE_UPLOAD_URL = 'https://www.googleapis.com/upload/drive/v2/files/';
var options = props;
var noop = function() {};
this.file = options.file;
this.contentType = options.contentType || this.file.type || 'application/octet-stream';
this.metadata = options.metadata || {
'title': this.file.name,
'mimeType': this.contentType
};
this.token = options.token;
this.onComplete = options.onComplete || noop;
this.onProgress = options.onProgress || noop;
this.onError = options.onError || noop;
this.offset = options.offset || 0;
this.chunkSize = options.chunkSize || 0;
//this.retryHandler = new RetryHandler();
this.retryHandler = new obj.RetryHandler();
this.url = options.url;
if (!this.url) {
var params = options.params || {};
params.uploadType = 'resumable';
//this.url = this.buildUrl_(options.fileId, params, options.baseUrl);
this.url = obj.buildUrl_(options.fileId, params, options.baseUrl);
}
this.httpMethod = options.fileId ? 'PUT' : 'POST';
}
RetryHandler = function() {
this.interval = 1000; // Start at one second
this.maxInterval = 60 * 1000; // Don't wait longer than a minute
};
retry = function(fn) {
setTimeout(fn, this.interval);
this.interval = this.nextInterval_();
};
reset = function() {
this.interval = 1000;
};
nextInterval_ = function() {
var interval = this.interval * 2 + this.getRandomInt_(0, 1000);
return Math.min(interval, this.maxInterval);
};
getRandomInt_ = function(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min);
};
buildQuery_ = function(params) {
params = params || {};
return Object.keys(params).map(function(key) {
return encodeURIComponent(key) + '=' + encodeURIComponent(params[key]);
}).join('&');
};
buildUrl_ = function(id, params, baseUrl) {
var url = baseUrl || DRIVE_UPLOAD_URL;
if (id) {
url += id;
}
var query = this.buildQuery_(params);
if (query) {
url += '?' + query;
}
return url;
};
upload = function() {
//var self = this;
var xhr = new XMLHttpRequest();
xhr.open(this.httpMethod, this.url, true);
xhr.setRequestHeader('Authorization', 'Bearer ' + this.token);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.setRequestHeader('X-Upload-Content-Length', this.file.size);
xhr.setRequestHeader('X-Upload-Content-Type', this.contentType);
xhr.onload = function(e) {
if (e.target.status < 400) {
var location = e.target.getResponseHeader('Location');
this.url = location;
this.sendFile_();
} else {
this.onUploadError_(e);
}
}.bind(this);
xhr.onerror = this.onUploadError_.bind(this);
xhr.send(JSON.stringify(this.metadata));
};
sendFile_ = function() {
var content = this.file;
console.log(content);
var end = this.file.size;
if (this.offset || this.chunkSize) {
// Only bother to slice the file if we're either resuming or uploading in chunks
if (this.chunkSize) {
end = Math.min(this.offset + this.chunkSize, this.file.size);
}
content = content.slice(this.offset, end);
console.log(content);
}
var xhr = new XMLHttpRequest();
xhr.open('PUT', this.url, true);
xhr.setRequestHeader('Content-Type', this.contentType);
xhr.setRequestHeader('Content-Range', 'bytes ' + this.offset + '-' + (end - 1) + '/' + this.file.size);
xhr.setRequestHeader('X-Upload-Content-Type', this.file.type);
if (xhr.upload) {
xhr.upload.addEventListener('progress', this.onProgress);
}
xhr.onload = this.onContentUploadSuccess_.bind(this);
xhr.onerror = this.onContentUploadError_.bind(this);
xhr.send(content);
console.log(content);
};
resume_ = function() {
var xhr = new XMLHttpRequest();
xhr.open('PUT', this.url, true);
xhr.setRequestHeader('Content-Range', 'bytes */' + this.file.size);
xhr.setRequestHeader('X-Upload-Content-Type', this.file.type);
if (xhr.upload) {
xhr.upload.addEventListener('progress', this.onProgress);
}
xhr.onload = this.onContentUploadSuccess_.bind(this);
xhr.onerror = this.onContentUploadError_.bind(this);
xhr.send();
};
extractRange_ = function(xhr) {
var range = xhr.getResponseHeader('Range');
if (range) {
this.offset = parseInt(range.match(/\d+/g).pop(), 10) + 1;
}
};
onContentUploadSuccess_ = function(e) {
if (e.target.status == 200 || e.target.status == 201) {
this.onComplete(e.target.response);
} else if (e.target.status == 308) {
this.extractRange_(e.target);
this.reset();
this.sendFile_();
}
};
onContentUploadError_ = function(e) {
if (e.target.status && e.target.status < 500) {
this.onError(e.target.response);
} else {
this.retry(this.resume_.bind(this));
}
};
onUploadError_ = function(e) {
this.onError(e.target.response); // TODO - Retries for initial upload
};
}
And here is the way I use it in my App.js:
import YTDAPI from './assets/API'
import RNFS from 'react-native-fs';
uploadMediaToYouTube = async function(accessToken, videoUri) {
const fileInfo = await RNFS.stat(videoUri);
var file = {
name: fileInfo.path.split('/').pop(),
size: fileInfo.size,
uri: fileInfo.path,
type: 'video/mp4'
}
var metadata = {
snippet: {
title: 'This is a new title',
description: 'This is a new description',
tags: ['youtube-cors-upload'],
categoryId: 22
},
status: {
privacyStatus: 'unlisted'
}
};
var uploader = new YTDAPI({
baseUrl: 'https://www.googleapis.com/upload/youtube/v3/videos',
file: file,
token: this.accessToken,
metadata: metadata,
params: {
part: Object.keys(metadata).join(',')
},
onError: function(data) {
console.log(data);
var message = data;
try {
var errorResponse = JSON.parse(data);
message = errorResponse.error.message;
} finally {
alert(message);
}
}.bind(this),
onProgress: function(data) {
var currentTime = Date.now();
var bytesUploaded = data.loaded;
var totalBytes = data.total;
var bytesPerSecond = bytesUploaded / ((currentTime - window.uploadStartTime) / 1000);
var estimatedSecondsRemaining = (totalBytes - bytesUploaded) / bytesPerSecond;
var percentageComplete = (bytesUploaded * 100) / totalBytes;
console.log("Uploaded: " + bytesUploaded + " | Total: " + totalBytes + " | Percentage: " + percentageComplete + " | Esitmated seconds remaining: " + estimatedSecondsRemaining);
}.bind(this),
onComplete: function(data) {
console.log("Complete");
}.bind(this)
});
window.uploadStartTime = Date.now();
uploader.upload();
}
For this to work you need to configure an API key, web ClientId and oauth2 consent screen on your Google Cloud Console and allow Youtube Data V3 API library and authenticate an user to get an access_token that you will pass to my function.
UPDATE
Getting the file with Fetch() causes App crash with large files because its tries to load the whole video file into memory. I fixed this issue by using react-native-fs. I updated my code above.
After trying with my own youtube account I am facing same problem.
The documentation of Youtube is not also clear. This question have simillar problem as yours, but this guy used axios.
He said he spent months on it, but failed to figure out. After that he used youtube-video-api from npm, https://www.npmjs.com/package/youtube-video-api.
I think you should move on to some other solution, don't stuck with this code.
Like you can host a node.js backend, and then send your video and video information to the backend to upload it to youtube for the app user.

Is there a way to fix Cannot read property 'post' of undefined?

I'm running a page in vue with a form, it submits and returns data to and from an API, I'm getting a 'post' of undefined error in the console and I can't seem to figure out what's going on.
<script>
methods: {
StartClient: function () { // Initiate XMLHttpRequest as aHttpRequest for GET
this.get = function(Url, Callback){
var aHttpRequest = new XMLHttpRequest();
aHttpRequest.onreadystatechange = function() {
if (aHttpRequest.readyState == 4 && aHttpRequest.status == 200)
Callback(aHttpRequest.responseText);
}
// use aHttpRequest with response headers, to allow GET
aHttpRequest.open("GET", Url, true);
aHttpRequest.setRequestHeader("X-Api-Key", "eVnbxBPfn01kuoJIdfgi46TiYNv8AIip1r3WbjsX");
aHttpRequest.send(null);
}
this.post = function(Url, message, Callback) { // initiate XMLHttpRequest as aHttpRequest for POST
var aHttpRequest = new XMLHttpRequest();
aHttpRequest.onreadystatechange = function() {
if (aHttpRequest.readyState == 4 && aHttpRequest.status == 200)
Callback(aHttpRequest.responseText);
}
// use aHttpRequest with response headers, to allow POST
aHttpRequest.open("POST", Url, true);
aHttpRequest.setRequestHeader("X-Api-Key", "eVnbxBPfn01kuoJIdfgi46TiYNv8AIip1r3WbjsX");
aHttpRequest.send(message);
}
},
submitData: function () { // Start a traceroute, followed by the 'Begin' button
document.getElementById('inputBox').disabled = true;
var targetInputButton = document.getElementById("inputBox").value;
var message = '{"targetInputButton":"' + targetInputButton + '"}';
this.StartClient().post('https://le75bkfcmg.execute-api.eu-west-2.amazonaws.com/dev/start-trace', message, function(response) {
document.getElementById('jobId').innerHTML = response;
});
},
sendBackData: function () { // Receive traceroute data, followed by the 'Generate data' button
var jobId = document.getElementById("jobId").innerHTML;
var message = '{"jobId":"' + jobId + '"}';
this.StartClient().post('https://le75bkfcmg.execute-api.eu-west-2.amazonaws.com/dev/check-trace', message, function(response) {
document.getElementById('report').innerHTML = response;
});
}
}
}
</script>

Can't get the final frame content with puppeteer

Steps to reproduce
My environment:
Puppeteer version: 1.0.0
Platform / OS version: Linux / centos7.0
URLs (if applicable): http://1255.ijkuek.cn/
Node.js version: v9.4.0
What steps will reproduce the problem?
const puppeteer = require('puppeteer');
var args = process.argv.splice(2)
var url = args[0]
var ua = 'Mozilla/5.0 (Windows NT 6.1; WOW64; rv:43.0) Gecko/20100101 Firefox/43.0';
puppeteer.launch({
ignoreHTTPSErrors:true,
timeout: 1000,
args: ['--no-sandbox', '--disable-setuid-sandbox']}).then(async browser => {
const page = await browser.newPage();
await page.setExtraHTTPHeaders({
'upgrade-insecure-requests': '1'
});
page.setUserAgent(ua)
page.setDefaultNavigationTimeout(25000)
await page.setRequestInterception(true)
page.on('request', (request) => {
var type = request.resourceType()
if (type == 'image' || type == 'media')
request.abort();
else{
console.log("request: " + request.url())
request.continue();
}
});
page.on('response', (response) => {
console.log('response: ' + response.url())
if(type == 'document'){
response.text().then(function (textBody) {
console.log(textBody)
})
}
});
const response = await page.goto(url, {
waitUntil: 'networkidle2',
})
.catch(function(err){ if(err.toString().indexOf("Timeout")) {
browser.close();
console.log("Timeout!")
process.exit();
}})
browser.close();
});
What is the expected result?
the right redirect frame content
What happens instead?
the result is either timeout(to set timeout number larger useless )or redirect to wrong url,finally,can't get the final content。but phantomjs can get it!

Casperjs fill input without name

i want to use facebook share dialog
Link to share dialog
with casperjs
i managed to select the post mode "group" from the first dropdown , but i failed when i tired to fill the group name input (i think it use ajax drop down list)
Screenshot of result
with no luck , here is my code .
var casper = require('casper').create({
pageSettings: {
loadImages: false,
loadPlugins: true,
userAgent: 'Mozilla/5.0 (Windows NT 6.3; WOW64; rv:39.0) Gecko/20100101 Firefox/39.0'
},
logLevel: "info",
verbose: true
});
casper.options.stepTimeout = 60000;
var fs = require('fs');
var x = require('casper').selectXPath;
var x1 = require('casper').selectXPath;
casper.start('http://facebook.com/login.php', function() {
console.log("page loaded");
this.test.assertExists('form#login_form', 'form is found');
this.fill('form#login_form', {
email: 'email',
pass: 'pass'
}, true);
this.wait(1000, function() {
casper.capture('login.png');
console.log("screen captured");
});
});
casper.thenOpen('https://www.facebook.com/dialog/share?app_id=966242223397117&redirect_uri=http://www.facebook.com/dialog/return/close&display=popup&href=http://www.isearchforjob.com/', function() {
console.log("debug loaded");
this.wait(1000, function() {
casper.capture('debug.png');
console.log("screen captured");
});
if (this.exists('span._55pe')) {
this.click('span._55pe');
casper.then(function() {
this.click(x('//span[text()="Share in a group"]'))
});
casper.waitForSelector('input#audience_group', function(){
casper.capture('clicked0.png');
this.fillSelectors('form#platformDialogForm', {
'input#audience_group': 'test'
}, false);
casper.capture('clicked01.png');
});
}
});
casper.run();
i tried also
this.sendKeys('#audience_group','group name');

Chrome, recognize open tab

I'm creating an extenstion for google chrome that will perform checking if a stream on twitch.tv is online and will notify the user evey X minutes, I got that covered. What I'm looking for is a JScirpt code that will recognize if user is already on the streamers channel and will stop notifying him.
var username="$user";
setInterval(check,300000);
function check()
{
request("https://api.twitch.tv/kraken/streams/" + username, function() {
var json = JSON.parse(this.response);
if (json.stream == null)
{
chrome.browserAction.setIcon({ path: "offline.png" });
}
else
{
notify();
}
});
return 1;
}
function notify(){
var opt = {type: "basic",title: username + " is streaming!",message: "Click to join!",iconUrl: "start.png"};
chrome.notifications.create("", opt, function(notificationId)
{
setTimeout(function()
{
chrome.notifications.clear(notificationId, function(wasCleared) { console.log(wasCleared); });
}, 3000);
});
chrome.browserAction.setIcon({path:"online.png" });
}
chrome.browserAction.onClicked.addListener(function () {
chrome.tabs.create({ url: "http://www.twitch.tv/"+username });
});
function request(url, func, post)
{
var xhr = new XMLHttpRequest();
xhr.onload = func;
xhr.open(post == undefined ? 'GET' : 'POST', url, true);
xhr.send(post || '');
return 1;
}
check();
Use window.location.href to get the complete URL.
Use window.location.pathname to get URL leaving the host.
You can read more here.