Skip to content

Commit

Permalink
Update url-shortener-stack.yaml
Browse files Browse the repository at this point in the history 
Fixed MOCK response errors
  • Loading branch information
@MederD
MederD authored Jun 3, 2024
1 parent a38148a commit 0e0cde1
Showing 1 changed file with 36 additions and 80 deletions.
116 changes: 36 additions & 80 deletions cloudformation/url-shortener-stack.yaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -428,103 +428,59 @@ Resources:
Integration:
Type: MOCK
IntegrationHttpMethod: GET
RequestTemplates:
application/json: |
{'statusCode': 200}
IntegrationResponses:
- StatusCode: 200
ResponseTemplates:
application/json: |
text/html: |
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<meta charset="utf-8">
<title>Private URL shortener</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// used only to allow local serving of files
$.ajaxSetup({
beforeSend: function(xhr) {
if (xhr.overrideMimeType) {
xhr.overrideMimeType("application/json");
}
}
});
$('#url_input').focus(); // set initial focus
$('form#submit').submit(function(event) {
$('#url_input_submit').prop('disabled', true);
// process the form
<title>URL Shortener Admin Page</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<h1>URL Shortener Admin</h1>
<form id="url-form">
<label for="long-url">Long URL:</label><br>
<input type="text" id="long-url" name="long-url"><br>
<input type="submit" value="Submit">
</form>
<p id="result"></p>
<script>
$(document).ready(function(){
$("#url-form").on("submit", function(event) {
event.preventDefault();
var longUrl = $("#long-url").val();
$.ajax({
type : 'POST',
url : '/create',
data : JSON.stringify({ 'long_url' : $('#url_input').val(), 'cdn_prefix': window.location.hostname }),
contentType : 'application/json; charset=utf-8',
dataType : 'json',
encode : true
})
.done(function(data,textStatus, jqXHR) {
$('#url_input_submit').prop('disabled', false);
if (data.error) {
$('#url-group').addClass('has-error'); // add the error class to show red input
$('#url-error').show().text(data.error); // add the actual error message under our input
} else {
$('form#submit').hide(); // hide initial submit form
$('form#result').show(); // and show the one used to display the results
$('#long_url').text(data.long_url);
$('#short_id').val(data.short_id).focus().select();
type: "POST",
url: "CHANGE-WITH-YOUR-API-URL",
data: JSON.stringify({ "long_url": longUrl }),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data){
$("#result").html('Short URL: <a href="' + data.short_id + '">' + data.short_id + '</a>');
},
error: function(errMsg) {
console.log(errMsg)
alert("Error: " + errMsg.responseText);
}
})
.fail(function(_, _, errorThrown) {
$('#url_input_submit').prop('disabled', false);
$('#url-group').addClass('has-error'); // add the error class to show red input
$('#url-error').show().text("Server error: "+errorThrown); // add the actual error message under our input
});
// stop the form from submitting the normal way and refreshing the page
event.preventDefault();
});
$('form#result').submit(function(event) {
location.reload();
});
});
</script>
</head>
<body>
<div class="col-sm-8 col-sm-offset-1">
<h1>Private URL shortener</h1>
<br/>
<form id="submit">
<div id="url-group" class="form-group">
<input type="url" required class="form-control" name="url" placeholder="Paste here the long URL here" id="url_input">
<div class="help-block" style="display: none" id="url-error"></div>
</div>
<button type="submit" class="btn btn-success" id="url_input_submit">Shorten</button>
</form>
<form id="result" style="display: none">
<div class="alert alert-success">Successfully shortened: <br/><span id="long_url"></span></div>
<div class="form-group">
<label for="name">You can now copy/paste the short URL</label>
<input type="text" class="form-control" name="url" readonly="readonly" id="short_id">
</div><button type="submit" class="btn btn-success" id="page_reload">New URL</button><div>
</div>
</form>
</div>
</body>
</html>
PassthroughBehavior: WHEN_NO_TEMPLATES
ResourceId: !Ref ApiResourceGet
RestApiId: !Ref apiGateway
MethodResponses:
- StatusCode: 200
ResponseModels:
text/html: Empty

RequestPOST:
DependsOn: IAMRole
Expand Down Expand Up @@ -578,4 +534,4 @@ Resources:
MethodResponses:
- StatusCode: 301
ResponseParameters:
method.response.header.Location: true
method.response.header.Location: true

0 comments on commit 0e0cde1

Please sign in to comment.