Server.js - require Micro not available because of missing Node.js?

Hi, I’m trying to take a payment using WebPayments SDK and PaymentApi. I’m working through your reference doc at https://developer.squareup.com/reference/sdks/web/payments/card-payments alongside your YouTube video “Sandbox 101: End to End Payments with Web Payments SDK”. Both of which are V.good but not aligned very well at all (so trying code from both).

I’ve managed to generate a Payment Token in WebPayments (in index.html) and am trying to send it to the PaymentsApi Server.js file.

on doing this it looks at

module.exports = router(
post(‘/payment’, createPayment),

and here is where it throws an error.

In my console I get the following message:

        <span><H1>Server Error in '/' Application.<hr width=100% size=1 color=silver></H1>

        <h2> <i>The resource cannot be found.</i> </h2></span>

        <font face="Arial, Helvetica, Geneva, SunSans-Regular, sans-serif ">

        <b> Description: </b>HTTP 404. The resource you are looking for (or one of its dependencies) could have been removed, had its name changed, or is temporarily unavailable. &nbsp;Please review the following URL and make sure that it is spelled correctly.
        <br><br>

        <b> Requested URL: </b>/payment<br><br>

        <hr width=100% size=1 color=silver>

        <b>Version Information:</b>&nbsp;Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.8.4494.0

        </font>

</body>

and the Exception error is:

[HttpException]: The controller for path '/payment' was not found or does not implement IController.
at System.Web.Mvc.DefaultControllerFactory.GetControllerInstance(RequestContext requestContext, Type controllerType)
at System.Web.Mvc.DefaultControllerFactory.CreateController(RequestContext requestContext, String controllerName)
at System.Web.Mvc.MvcHandler.ProcessRequestInit(HttpContextBase httpContext, IController& controller, IControllerFactory& factory)
at System.Web.Mvc.MvcHandler.BeginProcessRequest(HttpContextBase httpContext, AsyncCallback callback, Object state)
at System.Web.Mvc.MvcHandler.BeginProcessRequest(HttpContext httpContext, AsyncCallback callback, Object state)
at System.Web.Mvc.MvcHandler.System.Web.IHttpAsyncHandler.BeginProcessRequest(HttpContext context, AsyncCallback cb, Object extraData)
at System.Web.HttpApplication.CallHandlerExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute()
at System.Web.HttpApplication.ExecuteStepImpl(IExecutionStep step)
at System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean& completedSynchronously)

at createPayment (https://localhost:44302/Index.html:69:23)
at async HTMLButtonElement. (https://localhost:44302/Index.html:29:40)

The source of the error seems to be this line in Server.js

// micro provides http helpers
const { createError, json, send } = require(‘micro’);

Where it complains not able to find ‘micro’, in regards to Node.js.

I’ve check the directory where it is looking for this and the Node.js folder exists.

I have installed Node.js to my local machine and attached it via NuGet to my project too.

Am stumped as to what to look at next and have found nothing to help in the docs or forums.

Any ideas / questions appreciated.

Using Visual Studio Pro 2019 / ASP.Net WebApplication (.Net Framework) / C#

Hey @vwtrev! After installing Node, did you run npm install? It sounds like you’re missing some dependencies.

1 Like

Hi Josh, thanks for your reply. I think you are correct (in that I have missing dependencies) but am struggling with Node.js.

I have tried on my two machines, both running VS2019 (Pro and Community), and get the same issue.

Firstly, I’ve downloaded and installed Node.js V18.13.0-x64 on both machines.
I’ve also, inside of VS2019, used NuGet to add Node.js (which weirdly is v5.3) but neither of these versions of Node.js seems to have added a file called “Package.json”.

When I run ‘npm install’ in Windows Powershell or Developer Powershell (inside VS2019) I get the following message:

This seems to be directly related to my issue when trying to use Server.js.

I understand that this most probably isn’t a Square issue as such (a Node.js issue…??) but appreciate any help.

Cheers.

Hi, an update, finally managed this morning to get my PC to run ‘npm install’ at which point it added 840 dependencies, so I thought here we go, but no.

That made no difference, I still get “Payment Failed” and in the console, it is saying require is not defined.

After a bit more digging I can see that “require” is declared in ‘globals.d.ts’ which is a Node.js ‘types’ file.
There it says

declare var require: NodeRequire;

this is an interface that extends Node.JS.Require { }

I must admit I’ve now no idea what this means and why it’s complaining that its not defined, VS2019 can clearly see it in globals.d.ts

cheers

Happy to hear you’ve got the dependencies working! Are you attempting to run server.js in your browser from your frontend? That code will need to be server-side.

Hi, I’m running the whole project inside Visual Studio 2019, using IIS Express at
https://localhost:44302.

I’ve also uploaded it to a server that I use to demo projects to clients and still no cigar.

I’ve also just spent the last 3 days learning about Node.js and still I’ve no real idea why server.js won’t talk to Node.js (to get the ‘require’ module, or is it not a Node.js module I need to talk to?).

I understand why server.js needs ‘require’, it has methods, etc. similar in fashion to a Class in C#, that provides methods, functions, subroutines, etc. to perform tasks, but something is disconnected and I’m no closer to working it out.

Am I missing a module called ‘micro’ for instance, as in:

const { createError, json, send } = require(‘micro’);

I know I said previously it relates to “globals.d.ts” but it doesn’t work so, maybe that is incorrect.

cheers

It might be best to back up here and clone a fresh version of the quickstart project. Since you have Node.js installed already, the project should be able to run locally with minimal changes after cloning it.

Can you clone this repository and follow the steps in the README exactly? In particular, can you make sure you’re running the development server with npm run dev?

Hi, thanks for your reply.

So, I restarted my PC, started VS2019 Pro, and started a new project with “Clone a repository”

Cloned the Git by ‘Copy and Paste’ the following link:

https: //github.com/square/web-payments-quickstart

then inside VS2019 Developer PowerShell, I typed:

cd web-payments-quickstart

Then I typed “npm Install”, followed by “npm run dev” and got the following error

P.s. I pasted the "…//registry.npm.js.com/yargs-parser/… link into my browser and was able to download the file.

P.p.s I also tried to run npm install / npm run dev in Windows PowerShell (after changing to the correct directory) and got the same response Errors.

I will also add that I have successfully started a Local Server when following through a tutorial to Node.js.

Where I created a hello.js file and started a server and see “hello world” in my browser.

image

image

So you can see my confusion as to what is ot working / linked.

Cheers

I’d love to help more here from Square’s side, but it looks like these are issues with your Node/npm configuration. You’ll need to resolve the errors preventing you from completing the npm install before running the quickstart. How to do so is outside the scope of what I can help with, but once you’re able to install those dependencies we’re of course more than happy to assist with using Square’s Node SDK.

Hi Josh, ok, thanks for trying so far.

Cheers

1 Like

@vwtrev, is Node.js the language you prefer to develop with? If not what language would you prefer to work with? :slightly_smiling_face:

Hi Bryan, I’ve been designing front-end and backend systems for over 15 years using classic ASP and VB, then ASP.net and C# (with HTML, CSS, SQL server and some Javascript + Bootstrap in its last few guises) but never touched on a framework like Node.js before.

I have bespoke Frontend/backend systems for a couple of clients that work as the client wants and I don’t really want to reinvent the wheel, just to take a payment, if possible.

I’ve previously used Paypal and now use a merchant “Payment Sense” for online Card payments but one of my clients is looking to save some money on fees and also not have to use a different company for their POS card reader, so I suggested over a year ago that Square gave the best usability, features they wanted and costings.

As an update, I found I was running Node V14 on my PC, so updated that to V16 and followed the Web-Payments-quickstart guide from scratch and have been successful in taking as sandbox payment, and finding it in my Dashboard/Sandbox :slightly_smiling_face:

My laptop is running a newly installed Node.js V18 and still is not working, so trying to fix that. I’ll update about that.

I do have one easy question, when actioning “npm run dev” then browsing to ‘Localhost:3000’, how does it know to run ‘index.html’ as its startup file, where is that specified? is it inside Node?

cheers

Awesome! The reason I ask is because we have payment examples in other languages like C# that you can use and edit to fit your use case. :slightly_smiling_face:

Ok, now i’m getting somewhere, i’ll revisit the csharp ones.

Cheers.