I want to upload a jpg file to imgur and get the jpg's link.
I have imgur API's Client Id and Client Secret.
Delphi code as below:
procedure TfrmMain.Button6Click(Sender: TObject);
var
client: TRESTClient;
request: TRESTRequest;
response: TCustomRESTResponse;
begin
client := TRESTClient.Create(nil);
try
client.BaseURL := 'https://api.imgur.com/';
Client.AddParameter('Client ID', '...', TRESTRequestParameterKind.pkHTTPHEADER);
Client.AddParameter('Client Secret', '...', TRESTRequestParameterKind.pkHTTPHEADER);
request := TRESTRequest.Create(nil);
try
request.Client := client;
request.Method := rmPOST;
request.Resource := 'a/C11W7xC';
request.Accept := 'application/json';
request.AddParameter('image','D:\linedw.jpg' , pkFile);
request.Execute;
response := request.Response;
if response.Status.Success then
begin
mo_response.Lines.add('Success: ' + slinebreak + response.Content);
end
else
begin
mo_response.Lines.add('Failed ' + response.StatusText + ': ' + slinebreak + response.Content);
end;
finally
request.Free;
end;
finally
client.Free;
end;
end;
The error information from response.Content is as below:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>imgur: the simple 404 page</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="robots" content="noindex,nofollow" />
<meta name="keywords" content="images, funny pictures, image host, image upload, image sharing, image resize" />
<meta name="description" content="Imgur is home to the web's most popular image content, curated in real time by a dedicated community through commenting, voting and sharing." />
<meta name="copyright" content="Copyright 2014 Imgur, Inc." />
<meta http-equiv="X-UA-Compatible" content="IE=Edge;" />
<link rel="stylesheet" type="text/css" href="https://s.imgur.com/min/404.css?1393899213" />
<!--[if IE 9]><link rel="stylesheet" href="https://s.imgur.com/include/css/ie-sucks.css?0" type="text/css" /><![endif]-->
</head>
<body>
<div class="nodisplay">
Imgur is home to the web's most popular image content, curated in real time by a dedicated community through commenting, voting and sharing.
</div>
<div id="hallway">
<div class="container">
<div id="cat1" class="painting">
<img src="//s.imgur.com/images/404/cat1weyes.png">
<div class="eye-container">
<div class="eye left">
<div class="pupil"></div>
</div>
<div class="eye right">
<div class="pupil"></div>
</div>
</div>
</div>
<div id="cat2" class="painting">
<img src="//s.imgur.com/images/404/cat2weyes.png">
<div class="eye-container">
<div class="eye">
<div class="pupil"></div>
</div>
</div>
</div>
<div id="giraffe" class="painting">
<img src="//s.imgur.com/images/404/giraffeweyes.png">
<div class="eye-container">
<div class="eye left">
<div class="pupil"></div>
</div>
<div class="eye right">
<div class="pupil"></div>
</div>
</div>
<img class="monocle" src="//s.imgur.com/images/404/monocle.png" />
</div>
<div id="cat3" class="painting">
<img src="//s.imgur.com/images/404/cat3weyes.png">
<div class="eye-container">
<div class="eye left">
<div class="pupil"></div>
</div>
<div class="eye right">
<div class="pupil"></div>
</div>
</div>
</div>
<div id="cat4" class="painting">
<img src="//s.imgur.com/images/404/cat4weyes.png">
<div class="eye-container">
<div class="eye left">
<div class="pupil"></div>
</div>
<div class="eye right">
<div class="pupil"></div>
</div>
</div>
</div>
</div>
</div>
<div class="footer textbox">
<h1>Zoinks! You've taken a wrong turn.</h1>
<p>Let's split up, gang. If you're looking for an image, it's probably been deleted or may not have existed at all.</p>
<p>If you are looking for groovy images, visit our gallery!</p>
<img src="https://s.imgur.com/images/imgurlogo-header.png">
</div>
<script type="text/javascript">
(function(widgetFactory) {
widgetFactory.mergeConfig('analytics', {
isAdmin: false
});
})(_widgetFactory);
</script>
<script type="text/javascript" src="https://s.imgur.com/min/404.js?1393899213"></script>
<script type="text/javascript">
var e404 = E404.getInstance();
e404.generalInit();
</script>
</body>
</html>
I have no experience with calling a REST API. I searched for Delphi demo information, but I did not find much. I need some guidance about this.
Delphi 10.4 / Windows 10
You are trying to upload an image to an invalid resource a/C11W7xC on the server, which is why you get an HTTP 404 Not Found response with HTML content.
According to the documentation, the resource for uploading images is 3/upload instead.
I haven't used the API myself, but it seems to me that the authorization you are using is not in line with Imgur's authorization.
Imgur's API allows you to upload images either anonymously via an Authorization: ClientID {YOUR_CLIENT_ID} HTTP header, or using an Authorization: Bearer {YOUR_ACCESS_TOKEN} HTTP header to tie the uploaded image to your account. See Authorization and OAuth on how to obtain the access token.
Note that you should not share your client credentials with the whole world, it has secret in its name, afterall. I recommend you should renew your client credentials at this point.
Related
I finally got around to fidelling with expressJS. I have written a simple RestAPI and also want to serve some static HTML that consumes (via clientside-JavaScript) my RestAPI.
The RestAPI works fine, but on some subroutes CSS and JS files are looked up under the wrong URL.
I have the following directory setup:
src
|---models
|---controllers
|---views
|---css
|---main.css
|---js
|---core.js
|---html
|---login.html
|---payments.html
|---static
Both HTML files link to e.g. the core.js using
<script src="core.js" type="text/javascript"></script>
in the footer.
The index.js looks as follows:
var app = express();
...
app.set('views', path.join(__dirname, 'views/html'));
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');
app.use( express.static( "src/views/js") );
app.use( express.static( "src/views/css") );
app.use( express.static( "src/views/static") );
...
app.get('/:env/:org', function(req, res){
res.render('payments.html');
})
app.get('/', function(req, res){
res.render('login.html');
})
Now the strange thing is, that if I call myserver.com/ the login page gets displayed with all styles and JS functionality, but if I open myserver.com/path1/path2 ExpressJS tries to look up the files under myserver.com/path1/ (e.g. myserver.com/path1/main.css) instead myserver.com/main.css.
The HTML for where it does not work (that get sent vie the /path1/path2 route) looks like this:
<!DOCTYPE html>
<html lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" href="main.css"/>
<title>Greatpay login</title>
</head>
<body data-pagetype="login">
<header class="header">
<img src="logo.png"/>
</header>
<div class="body">
<div class="loginbox">
<span class="error"></span>
<div class="fieldline">
<span>Organisation:</span>
<input type="text" name="organisation"/>
<div class="clear"><!---clear---></div>
</div>
<div class="fieldline">
<span>Environment:</span>
<select name="environment"/>
<option value="TEST">Test</option>
<option value="PROD" selected="selected">Production</option>
</select>
<div class="clear"><!---clear---></div>
</div>
<div class="fieldline">
<span>Username:</span>
<input type="text" name="username"/>
<div class="clear"><!---clear---></div>
</div>
<div class="fieldline">
<span>Password:</span>
<input type="password" name="password"/>
</div>
<button id="login">Login</button>
</div>
</div>
<footer>
<script src="jquery-3.4.1.min.js" type="text/javascript"></script>
<script src="core.js" type="text/javascript"></script>
</footer>
</body>
</html>
Can anyone please help me resolve this and explain why this behaves like that?
Thanks in advance.
So I am trying to dynamically (using javascript) add an input field in a form by clicking the button "Add". The semantic-ui dropdown css styling to the first field since it is not added with javascript. However, after I press add, a new field created by the css styling is not applied.
Here is a link to a demo.
https://jsfiddle.net/traorefly/h83245ju/#&togetherjs=QidJs02nya
Here is my code
<!DOCTYPE html>
<html>
<head>
<title>TOPS</title>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css">
<body>
<div class="ui text container" style="margin-top: 20%">
<form action="" class="ui form">
<div class="field" id="timekeyword">
<label>Segment Start Time/Keywords</label>
<div class="ui action input">
<input type="text" placeholder="Ex: 08:23" name="cut"> <select id="keywords" multiple="multiple" class="ui fluid search dropdown" name="video[keywords][]">
<option value="Absolute">Absolute</option>
<option value="Absolute Two">Absolute Two</option>
</select>
<div class="ui positive button" id="addField">Add</div>
</div>
</div>
</form>
</div>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.js"></script>
<script >
$('.dropdown').dropdown();
$('#addField').click(function(){
var html = "<div class=\"field\">" +
" <div class=\"ui action input\">" +
" <input type=\"text\" placeholder=\"Ex: 08:23\" name=\"cut\">" +
"<select id=\"keywords\" multiple=\"multiple\" class=\"ui fluid search dropdown\" name=\"video[keywords][]\"><option value=\"Absolute\">Absolute</option>" +
"<option value=\"Absolute Convergence\">Absolute Convergence</option>" +
"<option value=\"Absolute Maximum\">Absolute Maximum</option>" +
" </div>" +
" </div>"
$('#timekeyword').after(html)
})
</script>
</body>
</html>
fiddle: https://jsfiddle.net/8pcfz2a7/
you should call $('.dropdown').dropdown(); for new elements as well.
so add $('.dropdown').dropdown(); to end of your click handler.
you can also put this in a function called update_ui, for reuse code.
I'm following the uber ouath2 guide on this link.
I also have a registered uber app with an app id, client id, client secret, server token and a redirect URI:
http://localhost:8084/testapp
However, when I invoke https://login.uber.com/oauth/v2/authorize?client_id=[my_client_id]&response_type=code&redirect_uri=http://localhost:8084/testapp, instead of receiving a link with a token code (specified as a paremeter), I'm receiving the next html content:
<html class="no-js">
<!--<![endif]-->
<head>
<meta content="HTML Tidy for Java (vers. 26 sep 2004), see www.w3.org" name="generator"/>
<meta charset="utf-8"/>
<meta content="IE=edge" http-equiv="X-UA-Compatible"/>
<title>Uber</title>
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"/>
<link type="image/x-icon" href="https://d1a3f4spazzrp4.cloudfront.net/login/images/favicon.17677bc2cadb48697a3d2da2efc65d8c.ico" rel="icon"/>
<link href="https://d1a3f4spazzrp4.cloudfront.net/login/style-login/style.770406eec666b67f729c6f924b60ee7e.css" rel="stylesheet" type="text/css"/>
<link href="https://d1a3f4spazzrp4.cloudfront.net/uber-fonts/2.0.1/superfine.css" rel="stylesheet" type="text/css"/>
<link href="https://d1a3f4spazzrp4.cloudfront.net/uber-icons/3.13.0/uber-icons.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div class="content text--center soft--top">
<div class="push-gutter--sides push-small--top">
<div id="login-content">
<div id="fb-root"/>
<script type="text/javascript">window.fbAsyncInit = function() {
FB.init({
appId : '277064115737714',
xfbml : false,
version : 'v2.2' // good until Oct-2016
});
if (window.asyncUberFacebook) {
window.asyncUberFacebook();
}
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = '//connect.facebook.net/en_US/sdk.js';
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<script type="text/javascript">window.phone_email_placeholder = 'Email or Phone Number';
window.locale = 'MX';</script>
<p class="primary-font primary-font--semibold background-line push--top push--bottom">
<span>Sign In</span>
</p>
<form novalidate="novalidate" id="login-form" class="form" method="post">
<input value="1469850228-01-me6IZ7r1uyi5eZuFlK3sjFsIsAmBEkXjr_sR7f1RCAw=" name="_csrf_token" type="hidden"/>
<input name="access_token" data-js="access-token" type="hidden"/>
<a data-js="facebook-connect" class="btn btn--full btn--facebook soft-small--sides" href="#">
<span class="push--ends flush">Continue with Facebook</span>
</a>
<p class="primary-font primary-font--semibold background-line push--top push--bottom">
<span>or use email</span>
</p>
<div id="input-container" class="form-group push-tiny--top flush--bottom">
<input id="email" value="" placeholder="Email Address" class="text-input square--bottom" name="email" type="email"/>
</div>
<div class="form-group push--bottom">
<input id="password" placeholder="Password" class="text-input square--top" name="password" type="password"/>
</div>
<button type="submit" class="btn btn--large btn--full">Sign In</button>
</form>
<hr id="signin-signup-separator" class="push--top push-small--bottom"/>
<p class="text--center push-small--bottom">
<a class="forgot-password" href="https://login.uber.com/forgot-password">Forgot Password</a>
</p>
<p class="text--center">
Don't have an account?
Sign Up
</p>
</div>
</div>
<script src="https://d1a3f4spazzrp4.cloudfront.net/login/scripts/analytics.7a14669194cf515d1963bd28ce5e8290.js" type="text/javascript"/>
<script type="text/javascript">Analytics.init({
services: {
tealium: {
account: 'uber',
profile: 'main',
env: 'prod',
geo: 'MX'
}
}
});</script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"/>
<script src="https://d1a3f4spazzrp4.cloudfront.net/login/scripts/login.b8edef605ff990f6a792faf084868f5c.js" type="text/javascript"/>
<script src="https://ws.audioeye.com/ae.js" type="text/javascript"/>
<script type="text/javascript">Analytics.track('load', 'login.pageview');</script>
</div>
</body>
</html>
I have searched for this kind of issue and also I have readed a lot of posts about uber api and oauth with no effective solutions.
What I'm doing wrong?
Thanks in advance for your help.
Are you saying that instead of a web page loading when you click that link in a browser, you're getting back a raw HTML response, or are you saying that you're making a GET request to that URL in some way other than opening it in a browser?
I'm responding to myself (partially), I hope this could help others.
According with Uber ouath2 guide, you must to explicitly display to your users a page where they must to interact putting their email account and password. When they do clic in "Login", they are redirected to an authorization page and, finally, when they accept the information access agreement, uber redirect to your specified uri, putting at the end, the authorization code.
However, my scenario is different and maybe I need to put another question, since what I need is to access to my own information using a registered uber app on my own uber account and, I need to automate the oauth2 validation process. I mean, this need to be an automated process where I will not there to interact with the uber agreement information statements: I need in an automated way, send my client id and all required data and retrieve an authorization code.
I am trying to access the flip-kart seller API as i registered with Flipkart seller APIs - Developer Admin portal by following steps as given in the documentation:-
https://seller.flipkart.com/api-docs/FMSAPI.html
After successfully registered with Flipkart as i hit the first API that is used for generate the access token, but as i hit this API via my code it will return me the login page html as response. I also tried to hit this via postman by following steps:-
1)Type of request i tried with both (GET,POST)
2)Set appid and app-secret in the header
3)Use the following url:-
https://api.flipkart.net/oauth-service/oauth/token\?grant_type\=client_credentials\&scope=Seller_Api
The following response i get:-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Flipkart</title>
<link type="text/css" rel="stylesheet"
href="./style.css" />
<link type="text/css" rel="stylesheet"
href="./bootstrap.css" />
</head>
<body>
<div class="navbar navbar-default navbar-static-top" role="navigation">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="#">Flipkart Permission Registration</a>
</div>
</div>
</div>
<div class="container">
<form id="loginForm" name="loginForm" role="form" class="form-signin" action="login.do" method="post">
<h2 class="form-signin-heading">Please sign in </h2>
<input type="email" class="form-control" placeholder="Email address"
name='j_username' required="" autofocus="">
<input type="password" name='j_password' class="form-control"
placeholder="Password" required="">
<button class="btn btn-lg btn-primary btn-block" type="submit" name="login">Sign in</button>
<input type="hidden" name="CSRFToken" value="987f582b-9a4e-4c6c-a14b-681f2b57ca34"></input>
</form>
</div>
</body>
</html>
i also tried with the sandbox URL they provided but same response on both cases.
As i google this issue i found somewhere that you need to change the URL like:-
https://api.flipkart.net/oauth-service/oauth/token?grant_type=client_credentials&scope=Seller_Api
i also tried with this but this will return the response as:-
{
"error": "unauthorized",
"error_description": "An Authentication object was not found in the SecurityContext"
}
So finally i am unable to get access-token for flipkart seller API. Please help me
Any help would be appreciated
Thanks!
You can get authCode using the following url in a browser by replacing appId with your flipkart appId: https://api.flipkart.net/oauth-service/oauth/authorize?client_id=appId&grant_type=authorization_code&response_type=code&scope=Seller_Api&state=1234
Once you get the authCode, using curl command you can get the access token by providing appId, appSecretKey and authCode: curl -u appId:appSecretKey https://api.flipkart.net/oauth-service/oauth/token\?grant_type=authorization_code\&state=1234\&code=authCode
Having trouble constructing a button dynamically with jQuery Mobile. Copy and run. See notes in code.
<!DOCTYPE html>
<html>
<head>
<title>MSC Pre-Close Application</title>
<meta charset="utf-8"/>
<!-- standard Jquery/jQuery Mobile Libraries -->
<script src="jquery.mobile/jquery.js"></script>
<script src="jquery.mobile/jquery.mobile.js"></script>
<link rel="stylesheet" href="jquery.mobile/jquery.mobile.css" />
<BR/>
<div data-role="page" id="mainmenu">
<div data-role="header" data-position="inline">
<h1>Main Menu</h1>
</div>
<div class="ui-body ui-body-c">
<div data-role="content">
<div class="ui-block-a"><button id="click_me" type="submit" data-theme="a" data-icon="home">Click me to change the button to my right</button></div>
<div class="ui-block-a"><button class="cl_pre_phone1" type="submit" rel="external" data-theme="a" data-icon="home">Primary Phone</button></div>
<script>
$(document).ready(function()
{
// this changes the label but not the href action.
$(".cl_pre_phone1").html("<a href='google.com'> Google</a>");
$("#click_me").click(function() {
alert("this should change the text and href of the button!");
// here I would like to change the value as well as the href action, but it does not work.
$(".cl_pre_phone1").html("<a href='yahoo.com'>Yahoo</a>");
//$(".cl_pre_phone1").append("<a href='yahoo.com'>Yahoo</a>");
//$(".cl_pre_phone1").append("<a href='yahoo.com'>Yahoo</a>").reload(true);
});
});
</script>
You're getting messed up by the enhancement which jQM does. Your button is getting rewritten to:
<span class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Primary Phone</span>
<span class="ui-icon ui-icon-home ui-icon-shadow"></span></span>
<button class="cl_pre_phone1 ui-btn-hidden" type="submit" data-theme="a" data-icon="home" aria-disabled="false">Primary Phone</button>
One way round this would be to change the call inside the callback to:
$(".cl_pre_phone1").attr("href", "http://yahoo.com").parent().find(".ui-btn-text").text("Yahoo");
or you could replace the whole ui-block-a div.